<template>
  <svg
    width="150px"
    height="30px"
    viewBox="0 0 150 30"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:xlink="http://www.w3.org/1999/xlink"
  >
    <text x="22%" y="70%" font-size="14" style="fill: #fff;">{{ title }}</text>
    <defs>
      <linearGradient x1="0%" y1="0%" x2="100%" y2="0%" id="linearGradient-1">
        <stop stop-color="#399FF9" stop-opacity="0.25" offset="0%" />
        <stop stop-color="#399FF9" stop-opacity="0" offset="100%" />
      </linearGradient>
      <linearGradient x1="0%" y1="0%" x2="100%" y2="0%" id="linearGradient-2">
        <stop stop-color="#399FF9" offset="0%" />
        <stop stop-color="#399FF9" stop-opacity="0" offset="100%" />
      </linearGradient>
      <linearGradient x1="0%" y1="0%" x2="100%" y2="0%" id="linearGradient-3">
        <stop stop-color="#399FF9" offset="0%" />
        <stop stop-color="#399FF9" stop-opacity="0" offset="100%" />
      </linearGradient>
    </defs>
    <g
      id="统计/标题"
      stroke="none"
      stroke-width="1"
      fill="none"
      fill-rule="evenodd"
    >
      <rect
        id="矩形"
        fill="url(#linearGradient-1)"
        x="0"
        y="0"
        width="150"
        height="30"
      />
      <path
        d="M18.5,25 C18.7761424,25 19,25.2238576 19,25.5 C19,25.7761424 18.7761424,26 18.5,26 L4.65355937,26 L2.68155937,28 L120.5,28 C120.776142,28 121,28.2238576 121,28.5 C121,28.7761424 120.776142,29 120.5,29 L1.5,29 L1.46820831,28.9985312 C1.45237404,28.9978688 1.43656443,28.9964526 1.42083788,28.9942819 L1.5,29 C1.46679072,29 1.43433763,28.9967624 1.40293914,28.9905856 C1.30686133,28.974577 1.21503242,28.9294756 1.14053854,28.8560285 C1.13970473,28.8552064 1.13887383,28.8543814 1.13804586,28.8535534 C0.942380365,28.6578879 0.941259294,28.3409989 1.13553548,28.1439539 L4.08846502,25.1489393 C4.19440776,25.0414867 4.33724902,24.9924945 4.4768336,25.0022469 C4.48436,25.0001805 4.49215892,25 4.5,25 L18.5,25 Z M23.5,25 C23.7761424,25 24,25.2238576 24,25.5 C24,25.7761424 23.7761424,26 23.5,26 L21.5,26 C21.2238576,26 21,25.7761424 21,25.5 C21,25.2238576 21.2238576,25 21.5,25 L23.5,25 Z M26.5,25 C26.7761424,25 27,25.2238576 27,25.5 C27,25.7761424 26.7761424,26 26.5,26 C26.2238576,26 26,25.7761424 26,25.5 C26,25.2238576 26.2238576,25 26.5,25 Z"
        id="形状结合"
        fill="url(#linearGradient-2)"
      />
      <path
        d="M13,6.2272736 C17.2927583,6.2272736 20.7727264,9.70724174 20.7727264,14 C20.7727264,18.2927583 17.2927583,21.7727264 13,21.7727264 C8.70724174,21.7727264 5.2272736,18.2927583 5.2272736,14 C5.2272736,9.70724174 8.70724174,6.2272736 13,6.2272736 M13,5 C8.02943725,5 4,9.02943725 4,14 C4,18.9705627 8.02943725,23 13,23 C17.9705627,23 22,18.9705627 22,14 C22,11.6130516 21.0517884,9.32386638 19.363961,7.63603897 C17.6761336,5.94821156 15.3869484,5 13,5 Z"
        id="形状"
        fill="url(#linearGradient-3)"
        fill-rule="nonzero"
      />
      <path
        d="M13,18.5000096 C12.6610978,18.5000096 12.3863632,18.225275 12.3863632,17.8863728 L12.3863632,10.1136272 C12.3863632,9.77472497 12.6610978,9.49999041 13,9.49999041 C13.3389022,9.49999041 13.6136368,9.77472497 13.6136368,10.1136272 L13.6136368,17.8863728 C13.6136368,18.225275 13.3389022,18.5000096 13,18.5000096 Z M10.5454528,16.6590992 C10.2065506,16.6590992 9.931816,16.3843646 9.931816,16.0454624 L9.931816,11.9545376 C9.931816,11.6156354 10.2065506,11.3409008 10.5454528,11.3409008 C10.884355,11.3409008 11.1590896,11.6156354 11.1590896,11.9545376 L11.1590896,16.0454624 C11.1590896,16.3843646 10.884355,16.6590992 10.5454528,16.6590992 Z M15.4545472,16.6590992 C15.115645,16.6590992 14.8409104,16.3843646 14.8409104,16.0454624 L14.8409104,11.9545376 C14.8409104,11.6156354 15.115645,11.3409008 15.4545472,11.3409008 C15.7934494,11.3409008 16.068184,11.6156354 16.068184,11.9545376 L16.068184,16.0454624 C16.068184,16.3843646 15.7934494,16.6590992 15.4545472,16.6590992 Z M17.5000096,15.6363584 C17.1611073,15.6363584 16.8863728,15.3616239 16.8863728,15.0227216 L16.8863728,12.9772784 C16.8863728,12.6383761 17.1611073,12.3636416 17.5000096,12.3636416 C17.8389118,12.3636416 18.1136464,12.6383761 18.1136464,12.9772784 L18.1136464,15.0227216 C18.1136464,15.3616239 17.8389118,15.6363584 17.5000096,15.6363584 L17.5000096,15.6363584 Z M8.49999041,15.6363584 C8.16108817,15.6363584 7.88635361,15.3616239 7.88635361,15.0227216 L7.88635361,12.9772784 C7.88635361,12.6383761 8.16108817,12.3636416 8.49999041,12.3636416 C8.83889266,12.3636416 9.11362721,12.6383761 9.11362721,12.9772784 L9.11362721,15.0227216 C9.11362721,15.3616239 8.83889266,15.6363584 8.49999041,15.6363584 L8.49999041,15.6363584 Z"
        id="形状"
        fill="#348DDB"
        fill-rule="nonzero"
      />
    </g>
  </svg>
</template>

<script>
export default {
  name: 'svg_title',
  props: {
    title: { type: String, default: '标题' },
  },
}
</script>
